<template>
  <v-dialog
      v-model="dialog"
      persistent
      max-width="600px"
  >
    <template v-slot:activator="{ on, attrs }">
      <v-btn
          style="position: absolute;bottom: 10%; right: 10%;color: white;border-radius: 30px" color="primary"
          v-bind="attrs"
          v-on="on"
      >
        回复
      </v-btn>
    </template>
    <v-card>
      <v-card-title>
        <span class="text-h5">回复</span>
      </v-card-title>
      <v-card-text>
        <v-container>
          <v-row>
            <v-col
                cols="12"
            >
              <v-text-field
                  disabled
                  v-bind:placeholder="reply.authorName"
              ></v-text-field>
            </v-col>
          </v-row>
          <v-row>
            <v-col
                cols="12"
            >
              <v-textarea label="正文" required v-model="content">
              </v-textarea>
            </v-col>
          </v-row>
        </v-container>
      </v-card-text>
      <v-card-actions>
        <v-spacer></v-spacer>
        <v-btn
            color="#FD564F"
            text
            @click="dialog = false"
            large
            style="font-size: 20px"
        >
          取消
        </v-btn>
        <v-btn
            color="green"
            text
            @click="releasepost"
            large
            style="font-size: 20px"
        >
          回复
        </v-btn>
      </v-card-actions>
    </v-card>
  </v-dialog>
</template>

<script>
export default {
  name: "replyDialog",
  components: {},
  props:{
    reply: Object,
  },
  watch:{
    reply:{

    }
  },
  data: () => ({
    title: "",
    content: "",
    dialog: false,
    myreply: []
  }),
  computed:{

  },
  methods:{
    getcontent(data){
      this.comment = data
      console.log(this.comment)
    },

    releasepost(){
      this.$api.article.replytoreply(this.content,this.$store.getters.getUserId,this.reply.id).then(res=>{
        if (res.success){
          this.$router.go(0)
        }
      })
    }
  }
}
</script>

<style scoped>

</style>